<!DOCTYPE html>
<html lang="en" xmlns:th="https://www.thymeleaf.org/">
<head>
    <meta charset="UTF-8">
    <title>上传</title>
    <link rel="stylesheet" th:href="@{/public/lib/layui-v2.6.3/css/layui.css}" media="all">
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main" style="padding:1.5em">
        <button type="button" class="layui-btn demo-class-accept" lay-options="{
            accept: 'file',
            exts: 'xlsx'
          }">
            <i class="layui-icon layui-icon-upload"></i>
            上传excel
        </button>
        <button type="button" class="layui-btn" id="download">
            <i class="layui-icon layui-icon-download-circle"></i>
            下载模板
        </button>
    </div>
</div>
<script th:src="@{/public/lib/layui-v2.6.3/layui.js}" charset="utf-8"></script>
<script>
    layui.use(function(){
        let upload = layui.upload;
        let layer = layui.layer;
        let $ = layui.jquery;
        // 渲染
        upload.render({
            elem: '.demo-class-accept', // 绑定多个元素
            url: '/system/user/importData', // 此处配置你自己的上传接口即可
            accept: 'file', // 普通文件
            done: function(res){
                if(res.code===200){
                    layer.msg('上传成功');
                    console.log(res);
                    let iframeIndex = parent.layer.getFrameIndex(window.name);
                    parent.layer.close(iframeIndex);
                }else{
                    layer.msg(res.msg);
                }

            }
        });

        // 下载模板
        $('#download').click(function () {
            window.open('/templates/user_template.xlsx');
        });

    });
</script>

</body>
</html>